<%--
XPTracker - Alternative Agile Tracking Tool
Copyright (C) 2006-2009  Stephen Starkey

This program is free software; you can redistribute it and/or
modify it under the terms of the GNU General Public License
as published by the Free Software Foundation; either version 2
of the License, or (at your option) any later version.

This program is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
GNU General Public License for more details.

You should have received a copy of the GNU General Public License
along with this program; if not, write to the Free Software
Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA
--%>
<%@ include file="/taglibs.jsp" %>
<c:set var="title" value="Timelines" scope="request"/>
<s:layout-render name="/layout/normal.jsp">
<ss:secure roles="admin">
<s:layout-component name="htmlHead">
  <script type="text/javascript">
    function deleteTimeline(id, name) {
      if (confirm('Really delete timeline "' + name + '"?')) {
        $('deleteAction').name = "Delete";
        $('id').value = id;
        $('deleteForm').submit();
      }
    }

    function editTimeline(id, name, interval, period, units) {
      $('name').value = name;
      $('interval').value = interval;
      $('period').value = period;
      $('units').value = units;
      $('addId').value = id;
      showEditForm();
    }

    function showEditForm() {
      Element.show('addForm');
      Element.show('addButton');
      $('addLegend').innerHTML = "Edit " + $('name').value;
      $('addFormButton').value = 'Save';
      $('addFormButton').name = 'Edit';
    }

    function showAddForm() {
      Element.show('addForm');
      Element.hide('addButton');
      $('addLegend').innerHTML = "Add a Timeline";
      $('addFormButton').value = 'Add';
      $('addFormButton').name = 'Add';
      $('name').value = '';
      $('interval').value = '';
      $('period').selectedIndex = 0;
      $('units').selectedIndex = 0;
    }

    function deleteCriterion(id, cid) {
      if (confirm('Really delete this criterion?')) {
        $('deleteAction').name = "DeleteCriterion";
        $('id').value = id;
        $('cid').value = cid;
        $('deleteForm').submit();
      }
    }

    function showQueueCriteriaField(pfx, id) {
      Element.show(pfx + '_queue_criteria_' + id);
      $(pfx + '_queue_criteria_' + id).disabled = false;
      Element.hide(pfx + '_state_criteria_' + id);
      $(pfx + '_state_criteria_' + id).disabled = true;
    }

    function showStateCriteriaField(pfx, id) {
      Element.show(pfx + '_state_criteria_' + id);
      $(pfx + '_state_criteria_' + id).disabled = false;
      Element.hide(pfx + '_queue_criteria_' + id);
      $(pfx + '_queue_criteria_' + id).disabled = true;
    }
  </script>
  </s:layout-component>
</ss:secure>
  <s:layout-component name="body">
    <dt:table name="actionBean.timelines" id="timeline" class="data" style="width:80%">
      <dt:column title="Name" style="vertical-align:top">
        <s:link beanclass="org.xptracker.web.TimeSegmentsActionBean">
          ${timeline.name}
          <s:param name="timelineId">${timeline.id}</s:param>
        </s:link>
      </dt:column>
      <dt:column title="Granularity" style="vertical-align:top">Every ${timeline.granularity.interval} ${timeline.granularity.period}</dt:column>
      <dt:column title="Units" style="vertical-align:top" property="units"/>
      <dt:column title="Entry Criteria" style="vertical-align:top;width:25%">
        <ss:secure roles="admin">
        <s:form beanclass="org.xptracker.web.TimelineActionBean" id="addEntryCriteria_${timeline.id}" class="criteria">
          <input type="hidden" name="id" value="${timeline.id}"/>
          <input id="e_queue_radio_${timeline.id}" type="radio" name="criterion.type" value="queue"
                 onclick="showQueueCriteriaField('e', '${timeline.id}')"/> Queue
          <input id="e_state_radio_${timeline.id}" type="radio" name="criterion.type" value="state"
                 onclick="showStateCriteriaField('e', '${timeline.id}')"/> State
          <div>
            <select id="e_queue_criteria_${timeline.id}" name="criterion.name" disabled="true" style="display:none">
              <c:forEach items="${actionBean.queues}" var="queue">
                <option>${queue.name}</option>
              </c:forEach>
            </select>

            <select id="e_state_criteria_${timeline.id}" name="criterion.name" disabled="true" style="display:none">
              <c:forEach items="${actionBean.states}" var="state">
                <option>${state}</option>
              </c:forEach>
            </select>
            <s:submit name="AddEntryCriterion" value="Add"/>
          </div>
          <script type="text/javascript">
            $('e_queue_radio_${timeline.id}').checked = true;
            showQueueCriteriaField('e', '${timeline.id}');
          </script>
        </s:form>
        </ss:secure>
        <ul>
          <c:forEach items="${timeline.entryCriteria}" var="criterion">
            <li>
              <ss:secure roles="admin">
              <a href="javascript:deleteCriterion('${timeline.id}', '${criterion.id}')" class="delete-criterion">
                <span class="delete-x">&nbsp;x&nbsp;</span>
              </a>
              </ss:secure>
              ${criterion}
            </li>
          </c:forEach>
        </ul>
      </dt:column>
      <dt:column title="Exit Criteria" style="vertical-align:top;width:25%">
        <ss:secure roles="admin">
        <s:form beanclass="org.xptracker.web.TimelineActionBean" id="addExitCriteria_${timeline.id}" class="criteria">
          <input type="hidden" name="id" value="${timeline.id}"/>
          <input id="x_queue_radio_${timeline.id}" type="radio" name="criterion.type" value="queue"
                 onclick="showQueueCriteriaField('x', '${timeline.id}')"/> Queue
          <input id="x_state_radio_${timeline.id}" type="radio" name="criterion.type" value="state"
                 onclick="showStateCriteriaField('x', '${timeline.id}')"/> State
          <div>
            <select id="x_queue_criteria_${timeline.id}" name="criterion.name" disabled="true" style="display:none">
              <c:forEach items="${actionBean.queues}" var="queue">
                <option>${queue.name}</option>
              </c:forEach>
            </select>

            <select id="x_state_criteria_${timeline.id}" name="criterion.name" disabled="true" style="display:none">
              <c:forEach items="${actionBean.states}" var="state">
                <option>${state}</option>
              </c:forEach>
            </select>
            <s:submit name="AddExitCriterion" value="Add"/>
          </div>
          <script type="text/javascript">
            $('x_queue_radio_${timeline.id}').checked = true;
            showQueueCriteriaField('x', '${timeline.id}');
          </script>
        </s:form>
        </ss:secure>
        <ul>
          <c:forEach items="${timeline.exitCriteria}" var="criterion">
            <li>
              <ss:secure roles="admin">
              <a href="javascript:deleteCriterion('${timeline.id}', '${criterion.id}')" class="delete-criterion">
                <span class="delete-x">&nbsp;x&nbsp;</span>
              </a>
              </ss:secure>
              ${criterion}
            </li>
          </c:forEach>
        </ul>
      </dt:column>
      <ss:secure roles="admin">
        <dt:column title="" style="vertical-align:top">
          <input type="button" name="" value="Delete" onclick="deleteTimeline('${timeline.id}', '${xp:jsFriendly(timeline.name)}')"/>
          <input type="button" name="" value="Edit"
                 onclick="editTimeline('${timeline.id}', '${xp:jsFriendly(timeline.name)}', ${timeline.granularity.interval},
                                       '${timeline.granularity.period}', '${timeline.units}')"/>
        </dt:column>
      </ss:secure>
    </dt:table>
    <ss:secure roles="admin">
      <br/>
      <input id="addButton" type="button" value="Add" onclick="showAddForm()" style="display:none"/>
  <s:form beanclass="org.xptracker.web.TimelineActionBean" id="addForm" style="margin-top:15px">
    <fieldset>
      <legend id="addLegend">Add a Timeline</legend>
      Name:
      <s:text name="timeline.name" id="name"/>
      with burndown granularity:
      <s:text name="timeline.granularity.interval" id="interval" size="4"/>
      <s:select name="timeline.granularity.period" id="period">
        <s:option>days</s:option>
        <s:option>weeks</s:option>
        <s:option>months</s:option>
      </s:select>
      measured in:
      <s:select name="timeline.units" id="units">
        <s:option>points</s:option>
        <s:option>pointsByTask</s:option>
        <s:option>hours</s:option>
        <s:option>hoursRemaining</s:option>
      </s:select>
      <s:submit id="addFormButton" name="Add" value="Add"/>

      <s:hidden name="timeline.id" id="addId"/>
    </fieldset>
  </s:form>

    <s:form beanclass="org.xptracker.web.TimelineActionBean" id="deleteForm" style="display:inline">
      <input type="hidden" name="id" id="id"/>
      <input type="hidden" name="cid" id="cid"/>
      <input type="hidden" id="deleteAction" name="" value="1"/>
    </s:form>
  </ss:secure>

    <s:errors>
      <s:errors-header>
        <script type="text/javascript">
          <c:if test="${actionBean.context.eventName eq 'Edit'}">showEditForm();</c:if>
        </script>
      </s:errors-header>
      <span style="display:none"><s:individual-error/></span>
      <s:errors-footer></s:errors-footer>
    </s:errors>
  </s:layout-component>
</s:layout-render>